<template>
	<div class="wrap">	
		<div class="body">
	    	<div class="headline">			  	    	 	 
	    	 	 <span class="title">企业统计</span>			  	    	 	 
	    	</div>  
	    	
	    	<div class="industry_wrap">
	    		<div class="section" v-for="(item,index) in industryList">
	    			<div class="top">
	    				<div>
		    				<div class="name">{{item.classification}}</div>
		    				<div class="icon"><i class="iconfont" :class="item.icon" style="font-size: 18px;color: #999;"></i></div>
	    				</div>
	    			</div>
	    			<div class="bottom">{{item.num}}</div>
	    		</div>
	    	</div>
    	</div>
    	 

    	 
	</div>
</template>	
<script>
	import {getDeptNum} from "@/api/bigScreen/bigScreen";
	export default {
		data() {
			return {
				a:'iconniangjiuxingye',
				industryList:[]
			}

		},
		mounted() {
           this.init()
		},
		methods: {
           init(){
             getDeptNum().then(res=>{
             	this.industryList=res.data.data
             	for(var i=0;i<this.industryList.length;i++){
					switch(this.industryList[i].classification) {
					     case '机械制造':
					        this.industryList[i].icon='iconjixiezhizao'
					        break;
					     case '酿酒':
					        this.industryList[i].icon='iconniangjiuxingye'
					        break;
					     case '火电':
					        this.industryList[i].icon='iconhuodian'
					        break;
					     case '化工':
					        this.industryList[i].icon='icontubiaozhizuomoban'
					        break;
					     case '电镀':
					        this.industryList[i].icon='icondiandu'
					        break;
					     case '造纸':
					        this.industryList[i].icon='iconzaozhi'
					        break;
					     case '河水处理':
					        this.industryList[i].icon='iconhedao'
					        break;
					     case '印染':
					        this.industryList[i].icon='iconyinshuayinran'
					        break;
					     case '其他':
					        this.industryList[i].icon='iconqita'
					        break;
					     case '钢铁':
					        this.industryList[i].icon='icongangtie'
					        break;
					     case '电子制造':
					        this.industryList[i].icon='icondianzizhizao'
					        break;
					     case '制药':
					        this.industryList[i].icon='iconzhiyao'
					        break;
					     case '危害处理':
					        this.industryList[i].icon='iconweihai'
					        break;
					     case '橡胶':
					        this.industryList[i].icon='iconxiangjiao'
					        break;
					     case '蓄铅电池':
					        this.industryList[i].icon='iconicons09'
					        break;
					     case '生活垃圾处理':
					        this.industryList[i].icon='iconshenghuolaji'
					        break;		
					     case '水泥':
					        this.industryList[i].icon='iconshuini'
					        break;						        
					} 
             	}
             })
           }			
		}
	}
</script>
<style lang="scss" scoped>
.wrap{height: 100%;}

.body{
  .industry_wrap{padding: 10px 20px;display: flex;flex-wrap: wrap;justify-content: space-between}	
  .industry_wrap .section{border: 1px solid #174b88;height: 75px;width: 5%;border-radius: 8px;color: #fff;margin-right: 10px;margin-bottom: 10px;
    .top{text-align: center;height: 55px;display: flex;align-items: center;justify-content: center;
      .name{font-size: 12px;margin-bottom: 4px;}
    }
    .bottom{height: 20px;background: #174b88;border-radius: 0 0 8px 8px;text-align: center;font-size: 12px;color: #120f1d;}
  }
}
.headline{
		display: flex;
		color: #fff;		
		.title{
      background: #131420;
      padding: 8px 15px;
      display: inline-block;
      font-size: 14px;
		    box-shadow: inset 0 0 10px 0 rgba(53,145,255,.8);
		    border: 1px solid #3591ff80;          
		}
}	

</style>
